@extends('front.public_layout.layout')


@section('style')
    <link rel="stylesheet" href="{{asset('/front/lib/muiplayer/mui-player/dist/mui-player.min.css')}}">
    <link rel="stylesheet" href="{{asset('/front/css/article.css')}}">
    <link rel="stylesheet" href="{{asset('/front/css/reservation.css')}}">
    <style>

    </style>
@endsection

@section('content')
    <div class="middle-content">

        <div class="reservation-list">
            <div class="list-info"></div>
            <div class="more-btn" onclick="article_list()">查看更多</div>
        </div>

        {{--    农品热销--}}
        <div class="goods-adv">
            <div class="title">农品热销</div>

            @foreach($hotGoods as $hotGoodsVal)
            <a class="goods-adv-item" href="{{ url('shop/details/'.$hotGoodsVal->id) }}">
                <div class="goods-img">
                    <img src="{{ $hotGoodsVal->goods_img_url }}" alt="">
                </div>
                <div class="goods-name">{{ $hotGoodsVal->goods_name }}</div>
                <div class="price">{{ $hotGoodsVal->acticity_price }}元</div>
            </a>
            @endforeach

        </div>

        <input type="hidden" name="reservation_list" value="{{ url('ajax_things_lists') }}">
        <input type="hidden" name="common_list_url" value="{{ url('ajax_things_common_lists') }}">
    </div>

@endsection


@section('js')

    <script src="{{asset('front/lib/image-preview/js/imagePreview.min.js')}}"></script>
    <script src="{{asset('front/lib/muiplayer/mui-player/dist/mui-player.min.js')}}"></script>
    <script src="{{asset('front/lib/muiplayer/mui-player-desktop-plugin/dist/mui-player-desktop-plugin.min.js')}}"></script>
    <script>

        function article_list() {
            var list_url = $('input[name="reservation_list"]').val();
            if (list_url) {
                $.post(list_url, {
                    _token: '{{ csrf_token() }}'
                }, function (data) {
                    if (data) {
                        $('input[name="reservation_list"]').remove();
                        $('.list-info').append(data);
                        if (!$('input[name="reservation_list"]').val()) {
                            $('.more-btn').hide();
                        }
                    } else {
                        $('.more-btn').hide();
                    }
                }, 'html');
            } else {
                $('.more-btn').hide();
            }
        }
        article_list();
        
        function common_list(things_id, is_first = 0) {
            if (is_first == 1) {
                var list_url = $('input[name="common_list_url"]').val();
            } else {
                var list_url = $('input[name="common_list_url'+things_id+'"]').val();
            }
            $.post(list_url, {
                _token: '{{ csrf_token() }}',
                things_id: things_id
            }, function (data) {
                if (data) {
                    if (is_first == 1) {
                        $('div[data-things-id="'+things_id+'"]').find('.common-list').remove();
                        $('div[data-things-id="'+things_id+'"]').append(data);
                    } else {
                        $('input[name="common_list_url'+things_id+'"]').remove();
                        $('div[data-things-id="'+things_id+'"]').find('.more-common').remove();
                        $('div[data-things-id="'+things_id+'"]').find('.common-list').append(data);
                    }
                }
            }, 'html');
        }

    </script>
@endsection